import ThemedImage from "@theme/ThemedImage";
import Admonition from "@theme/Admonition";

export default function RedirectURIs(props) {
  return ["web", "native", "user-agent"].includes(props.appType) ? (
    <div>
      <p>
        During the login flow the application defines where a user is redirected
        to after login or logout.
        <br />
        ZITADEL verifies if the URL the user gets redirected to is valid by
        checking if one of the redirect URIs match.
      </p>
      <ul>
        <li>
          <b>Redirect URIs</b> are verified during the login process.
        </li>
        {props.redirectURI ? (
          <ul>
            <li>
              The default redirect uri of your app is{" "}
              <code>{props.redirectURI}</code>
            </li>
          </ul>
        ) : null}
        <li>
          <b>Post Logout URIs</b> are verified during the logout process.
        </li>
        {props.postLogoutURI ? (
          <ul>
            <li>
              The default post logout uri of your app is{" "}
              <code>{props.postLogoutURI}</code>
            </li>
          </ul>
        ) : null}
      </ul>
      <Admonition type="note">
        <p>
          The default redirect uri of your app is{" "}
          <code>{props.redirectURI}</code>
        </p>
      </Admonition>
      <img
        width="600px"
        alt="Redirect URIs configuration"
        src={"/docs/img/guides/application/redirect-uris.png"}
      />
    </div>
  ) : null;
}
